﻿@inject IMessageService _message

<Button Type="ButtonType.Primary" OnClick="@(()=>{ _visible = true; })">
    Open Modal
</Button>
<Modal Title="@title"
       @bind-Visible="@_visible">
    <b>Select:</b><br />

    <Form Model="_formModal">
        <FormItem Label="类型">
            <RadioGroup @bind-Value="@context.Type">
                <Radio Value="1">Select</Radio>
                <Radio Value="2">None</Radio>
            </RadioGroup>
        </FormItem>
        @if (context.Type == 1)
        {
            <FormItem>
                <Select DataSource="@_persons" 
                        @bind-Value="@context.SelectedValue"
                        LabelName="@nameof(Person.Name)" 
                        ValueName="@nameof(Person.Id)" 
                        Placeholder="Select a person"
                        Style="width:120px"
                        AllowClear>
                </Select>
            </FormItem>
        }
    </Form>
    <div style="margin: 64px" />

    <b>Dropdown:</b><br />
    <Dropdown>
        <Overlay>
            <Menu>
                <MenuItem>
                    <a target="_blank" rel="noopener noreferrer" href="http://www.alipay.com/">
                        1st menu item
                    </a>
                </MenuItem>
            </Menu>
        </Overlay>
        <ChildContent>
            <a class="ant-dropdown-link" @onclick:preventDefault>
                Hover me <Icon Type="@IconType.Outline.Down" />
            </a>
        </ChildContent>
    </Dropdown>

    <div style="margin: 64px" />

    <b>DatePicker:</b><br />
    <DatePicker TValue="DateTime?" Picker="DatePickerType.Date" />

    <div style="margin: 64px" />

    <b>Tooltip:</b><br />
    <Tooltip Title="prompt text">
        <span>Tooltip will show on mouse enter.</span>
    </Tooltip>

    <div style="margin: 64px" />

    <b>Popconfirm:</b><br />
    <Popconfirm Title="Are you sure delete this task?"
                OkText="Yes"
                CancelText="No">
        <a>Delete</a>
    </Popconfirm>

</Modal>

@code{
    class FormModal
    {
        public string Name { get; set; }
        public int Type { get; set; }
        public int SelectedValue { get; set; }
    }

    class Person
    {
        public int Id { get; set; }
        public string Name { get; set; }
    }

    string title = "BasicModal";
    bool _visible = false;
    List<Person> _persons;

    RenderFragment _content =
    @<div>
        <p>Content</p>
        <p>Content</p>
    </div>;

    private FormModal _formModal = new FormModal();

    protected override void OnInitialized()
    {
        _persons = new List<Person> 
        {
            new Person {Id = 1, Name = "Jack"}, 
            new Person {Id = 2, Name = "Lucy"}, 
            new Person {Id = 3, Name = "Yaoming"}, 
            new Person {Id = 4, Name = "Frieda"}, 
        };
    }
}